import { mapState } from 'vuex';

export default {
  data() {
    return {
      // base
      menus: []
    };
  },

  computed: {
    ...mapState({
      // 动态主路由
      mainMenu: (state) => state.permission.addRouters
    })
  },
  created() {
    // bind router (绑定路由)
    // const routes = this.mainMenu.find((item) => item.path === '/');
    // this.menus = (routes && routes.children) || [];
    this.getBreadcrumb();
  },

  watch: {
    $route() {
      this.getBreadcrumb();
    }
  },

  methods: {
    getBreadcrumb() {
      this.menus = [];

      const { hideBreadcrumb } = this.$route.meta;
      if (hideBreadcrumb) return;

      // only show routes with meta.title
      const matched = this.$route.matched.filter((item) => item.meta && item.meta.title);

      this.menus = matched.filter((item) => item.meta && item.meta.title && item.meta.breadcrumb !== false);
    }
  }
};
